<!--
  *  员工 表单 弹窗
  * 
  * @Author:    1024创新实验室-主任：卓大 
  * @Date:      2022-08-08 20:46:18
  * @Wechat:    zhuda1024 
  * @Email:     lab1024@163.com 
  * @Copyright  1024创新实验室 （ https://1024lab.net ），Since 2012 
-->
<template>
    <a-drawer
            :title="form.id ? '编辑' : '添加'"
            :width="600"
            :visible="visible"
            :body-style="{ paddingBottom: '80px' }"
            @close="onClose"
            destroyOnClose
    >
        <a-form ref="formRef" :model="form" :rules="rules" layout="vertical">
<!--            <a-form-item label="医馆编号" name="appid">-->
<!--                <a-input v-model:value.trim="form.appid" :disabled="form.id ? true : false" placeholder="请输入医馆编号"/>-->
<!--            </a-form-item>-->
<!--            <a-form-item label="医馆名称" name="businesses_name">-->
<!--                <a-input v-model:value.trim="form.businesses_name" :disabled="form.id ? true : false" placeholder="请输入医馆名称"/>-->
<!--            </a-form-item>-->

            <a-form-item label="医馆名称" name="appid">
                <a-select :disabled="form.id ? true : false" v-model:value="form.appid" optionFilterProp="title" placeholder="请选择医馆">
                    <a-select-option v-for="item in businessesNameList" :key="item.valueCode" :value="item.valueCode" :title="item.valueName">{{ item.valueName }}</a-select-option>
                </a-select>

            </a-form-item>
            <a-form-item label="医生头像" v-if="form.id" name="icon">
                <a-image :src="form.icon" style="max-width: 150px; max-height: 150px;"/>
            </a-form-item>
            <a-form-item label="医生名称" name="name">
                <a-input v-model:value.trim="form.name" placeholder="请输入医生名称"/>
            </a-form-item>
            <a-form-item label="医生头像" name="icon">
                <a-input v-model:value.trim="form.icon" placeholder="请输入医生头像地址"/>
            </a-form-item>
            <a-form-item label="医生职称" name="posts">
                <a-input v-model:value.trim="form.posts" placeholder="请输入医生职称"/>
            </a-form-item>
            <a-form-item label="坐诊方式" name="worktab">
                <a-input v-model:value.trim="form.worktab" placeholder="请输入医生坐诊方式"/>
            </a-form-item>
            <a-form-item label="医生诊费" name="fee">
                <a-input v-model:value.trim="form.fee" placeholder="请输入医生医生诊费"/>
            </a-form-item>
            <a-form-item label="医生部门" name="department">
                <a-input v-model:value.trim="form.department" placeholder="请输入医生部门"/>
            </a-form-item>
            <a-form-item label="驻点主场医院" name="des">
                <a-input v-model:value.trim="form.station_name" placeholder="请输入驻点主场医院描述"/>

            </a-form-item>
            <a-form-item label="医生电话" name="tel">
                <a-input v-model:value.trim="form.tel" placeholder="请输入医生联系电话"/>
            </a-form-item>
            <a-form-item label="医生描述" name="des">
                <a-textarea v-model:value.trim="form.des" :rows="6" placeholder="请输入医生描述"/>
            </a-form-item>


            <a-form-item label="毕业信息" name="credentials">
                <a-textarea v-model:value.trim="form.credentials" :rows="6" placeholder="请输入医生毕业信息"/>
            </a-form-item>
            <a-form-item label="擅长专注" name="excel">
                <a-textarea v-model:value.trim="form.excel" :rows="6" placeholder="请输入医生擅长专注"/>
            </a-form-item>


            <a-form-item label="操作退款密码" name="refundpassword">
                <p class="hint">需注意需要进行MD5加密</p>
                <a-input v-model:value.trim="form.refundpassword" placeholder="请输入医生操作退款密码"/>
            </a-form-item>

            <!-- <a-form-item label="坐标名称" name="location_name">
               <a-input v-model:value.trim="form.location_name" placeholder="请输入坐标名称" />
             </a-form-item>
             <a-form-item label="坐标地址" name="location">
               <a-input v-model:value.trim="form.location" placeholder="请输入坐标地址" />
             <p class="hint">使用逗号分割</p>
             </a-form-item> -->
<!--            <a-form-item label="状态" name="status">-->
<!--                <a-select v-model:value="form.status" placeholder="请选择状态">-->
<!--                    <a-select-option :value="0">启用</a-select-option>-->
<!--                    <a-select-option :value="1">禁用</a-select-option>-->
<!--                </a-select>-->
<!--            </a-form-item>-->

            <a-form-item label="是否已休息" name="frameFlag">
                <a-switch v-model:checked="form.is_rest" checked-children="休息中" un-checked-children="正在值班" />
            </a-form-item>
            <a-form-item label="是否是管理员" name="frameFlag">
                <a-switch @change="onChange" v-model:checked="form.is_admin" checked-children="是管理员" un-checked-children="非管理人员" />
            </a-form-item>
            <a-form-item v-if="select_admin" label="微信OPENID" name="openid" >
                <a-input v-model:value.trim="form.openid" placeholder="请输入医生微信OPENID"/>
            </a-form-item>
            <a-form-item label="预约订单是否通知自己" name="frameFlag">
                <a-switch  v-model:checked="form.is_notice_to_doctor" checked-children="启用" un-checked-children="禁用" />
            </a-form-item>
            <a-form-item label="医生是否禁用" name="frameFlag">
                <a-switch v-model:checked="form.status" checked-children="已禁用" un-checked-children="正常" />
            </a-form-item>

        </a-form>
        <div class="footer">
            <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
            <a-button type="primary" style="margin-right: 8px" @click="onSubmit(false)">保存</a-button>
            <a-button v-if="!form.id" type="primary" @click="onSubmit(true)">保存并继续添加</a-button>
        </div>
    </a-drawer>
</template>
<script setup lang="ts">
import {message} from 'ant-design-vue';
import _ from 'lodash';
import {nextTick, reactive, ref} from 'vue';
import {roleApi} from '/@/api/system/role/role-api';
import {businessesApi} from '/@/api/system/infirmary/businesses-api';
import DepartmentTreeSelect from '/@/components/system/department-tree-select/index.vue';
import SmartEnumSelect from '/@/components/framework/smart-enum-select/index.vue';
import {GENDER_ENUM} from '/@/constants/common-const';
import {regular} from '/@/constants/regular-const';
import {SmartLoading} from '/@/components/framework/smart-loading';
import {smartSentry} from '/@/lib/smart-sentry';
// ----------------------- 以下是字段定义 emits props ---------------------
const departmentTreeSelect = ref();
// emit
const emit = defineEmits(['refresh', 'show-account']);

// ----------------------- 显示/隐藏 ---------------------

const visible = ref(false); // 是否展示抽屉
// 隐藏
// 选择的是上午还是下午
const select_admin= ref(false);
// ----------------------- 表单显示 ---------------------

const businessesNameList = ref([]); //角色列表
async function queryAllBusinessesNameList() {
    let res = await businessesApi.queryBusinessesQueryValueList();
    businessesNameList.value = res.data;
}

function onClose() {
    reset();
    console.log("关闭了as")
    visible.value = false;
}

function onChange(checked) {
    console.log("是否是管理员",checked)
    rules.openid[0].required=checked
    select_admin.value = checked
}

// 显示
async function showDrawer(rowData) {
    console.log("关闭了as显示", rowData, !_.isEmpty(rowData))
    Object.assign(form, formDefault);




    if (rowData && !_.isEmpty(rowData)) {
        Object.assign(form, rowData);
    } else {
        Object.assign(form, {});
    }
    visible.value = true;
    select_admin.value = rowData.is_admin;
    rules.openid[0].required=rowData.is_admin;
    nextTick(() => {
        // 执行异步获取医馆列表信息
        queryAllBusinessesNameList();
    });
}

// ----------------------- 表单显示 ---------------------
const formRef = ref(); // 组件ref
// 添加的时候相关表单信息的是否显示的关键点
const formDefault = {
    id: undefined,
    appid: undefined,
    name: undefined,
    icon: undefined,
    tel: undefined,
    fee: undefined,
    addr: undefined,
    posts:undefined,
    worktab:undefined,
    excel:undefined,
    department:undefined,
    des:undefined,
    openid:undefined,
    is_rest:false,
    is_admin:false,
    is_notice_to_doctor:false,
    credentials:undefined,
    refundpassword:undefined,
    status: 0,
    businesses_name: undefined,
    station_name: undefined,

};

let form = reactive(_.cloneDeep(formDefault));

function reset() {
    Object.assign(form, formDefault);
    formRef.value.resetFields();
}

// ----------------------- 表单提交 ---------------------
// 表单规则
const rules = {
    appid: [
        {required: true, message: '渠道编号不能为空'},
    ],
    openid: [
        {required: select_admin.value, message: '微信OPENID不能为空'},
    ],
    businesses_name: [
        {required: true, message: '医馆名称不能为空'},
    ],
    name: [
        {required: true, message: '医馆名称不能为空'},
    ],
    fee: [
        {required: true, message: '医馆名称不能为空'},
    ],
    status: [{required: true, message: '状态不能为空'}],
};

// 校验表单
function validateForm(formRef) {
    return new Promise((resolve) => {
        formRef
            .validate()
            .then(() => {
                resolve(true);
            })
            .catch(() => {
                resolve(false);
            });
    });
}

// 提交数据
async function onSubmit(keepAdding) {

    formRef.dc_number = 'xxxxxx'

    let validateFormRes = await validateForm(formRef.value);
    if (!validateFormRes) {
        message.error('参数验证错误，请仔细填写表单数据!');
        return;
    }
    SmartLoading.show();
    if (form.id) {
        // 更新医生信息
        await updateBusinessesDoctorUserinfo(keepAdding);
    } else {
        // 添加医生信息
        await addBusinessesDoctorUserinfo(keepAdding);
    }
}

async function addBusinessesDoctorUserinfo(keepAdding) {
    try {
        let {data} = await businessesApi.addBusinessesDoctorUserinfo(form);
        message.success('添加成功');
        emit('show-account', form.loginName, data);
        if (keepAdding) {
            reset();
        } else {
            onClose();
        }
        emit('refresh');
    } catch (error) {
        // smartSentry.captureError(error);
    } finally {
        SmartLoading.hide();
    }
}

async function updateBusinessesDoctorUserinfo(keepAdding) {
    try {
        let result = await businessesApi.updateBusinessesDoctorUserinfo(form);
        message.success('更新成功');
        if (keepAdding) {
            reset();
        } else {
            onClose();
        }
        emit('refresh');
    } catch (error) {
        // smartSentry.captureError(error);
    } finally {
        SmartLoading.hide();
    }
}

// ----------------------- 以下是暴露的方法内容 ----------------------------
defineExpose({
    showDrawer,
});
</script>
<style scoped lang="less">
.footer {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  border-top: 1px solid #e9e9e9;
  padding: 10px 16px;
  background: #fff;
  text-align: right;
  z-index: 1;
}

.hint {
  margin-top: 5px;
  color: #bfbfbf;
}
</style>
